<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>悦动科技005</title>
    <link rel="stylesheet" href="css/weiwei005.css">
</head>
<body>
    <div>
        <div class="fixedHeader">
            <img src="image/yuedong_logo.jpg">
            <ul class="header-nav">
                    <li>
                        <a href="#chapter1">导航链接一</a>
                    </li>
                    <li>
                        <a href="#chapter2">导航链接二</a>
                    </li>
                    <li>
                        <a href="#chapter3">导航链接三</a>
                    </li>
                    <li>
                        <a href="#chapter4">导航链接四</a>
                    </li>
                </ul>   
        </div>
        <div class="placeholderHeader">
        </div>
        <div class="leftDiv">
            <div class="chapter1">
                <h2>文章一级标题</h2>
                    <h2>文章二级标题</h2>
                    <p>文章作者 文章发表时间</p>
                    <p>这是一个很长很长的段落, 这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落, 这是一个很长很长的段落,这是一个很长很长的段落,
                        <br>换行了
                        <br>这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落, 这是一个很长很长的段落,换行了
                        <br>这是一个很长很长的段落,这是一个很长很长的段落,
                        <a href="http://ife.baidu.com">这里有一个链接链接到http://life.baidu.com</a>这是一个很长很长的段落, 这是一个很长很长的段落,
                        <b>这里有粗体字</b>,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落, 这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,
                    </p>
                    <img src="image/weiwei001.png" />
                    <p>这是一个很长很长的段落, 这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落, 这是一个很长很长的段落,这是一个很长很长的段落,
                        <br>换行了
                        <br>这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落, 这是一个很长很长的段落,换行了
                        <br>这是一个很长很长的段落,这是一个很长很长的段落,
                        <a href="http://ife.baidu.com">这里有一个链接链接到http://life.baidu.com</a>这是一个很长很长的段落, 这是一个很长很长的段落,
                        <b>这里有粗体字</b>,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落, 这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,
                    </p>
            </div>
            <div class="chapter2">
                    <h2>另一篇文章一级标题</h2>
                    <h2>文章二级标题</h2>
                    <p>文章作者 文章发表时间</p>
                    <p>这是一个很长很长的段落, 这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落, 这是一个很长很长的段落,这是一个很长很长的段落,
                        <br>换行了
                        <br>这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落, 这是一个很长很长的段落,换行了
                        <br>这是一个很长很长的段落,这是一个很长很长的段落,
                        <a href="http://ife.baidu.com">这里有一个链接链接到http://life.baidu.com</a>这是一个很长很长的段落, 这是一个很长很长的段落,
                        <b>这里有粗体字</b>,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落, 这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,
                    </p>
                    <img src="image/weiwei001.png" />
                    <ul class="listTwo">
                        <li>列表项目一</li>
                        <li>列表项目二</li>
                        <li>列表项目三</li>
                    </ul>
            </div>
            <div class="chapter3">
                    <h2>图片</h2>
                    <div class="imgDiv">
                        <p>好看的图片</p>
                        <img class="chapter3img" src="image/weiwei001.png" />
                    </div>
                    <div class="imgDiv">
                        <p>好看的图片</p>
                        <img class="chapter3img" src="image/weiwei001.png" />
                    </div>
                    <div class="imgDiv">
                        <p>好看的图片</p>
                        <img class="chapter3img" src="image/weiwei001.png" />
                    </div>
                    <div class="imgDiv">
                        <p>好看的图片</p>
                        <img class="chapter3img" src="image/weiwei001.png" />
                    </div>
            </div>
            <div class="chapter4">
                    <h2>最后一篇文章一级标题</h2>
                    <h2>文章二级标题</h2>
                    <p>文章作者 文章发表时间</p>
                    <ol>
                        <li>排名1</li>
                        <li>排名2</li>
                        <li>排名3</li>
                    </ol>
                    <p>下面是一个表格,给表格加一个border="1"好让你看出是一个表格</p>
                    <table border="1" class="tablecls">
                        <tr>
                            <th>表头</th>
                            <th>表头</th>
                            <th>表头</th>
                        </tr>
                        <tr>
                            <td>表内容单元格</td>
                            <td>表内容单元格</td>
                            <td>
                                <a href="#">操作</a>
                            </td>
                        </tr>
                        <tr>
                            <td>表内容单元格</td>
                            <td>表内容单元格</td>
                            <td>
                                <a href="#">操作</a>
                            </td>
                        </tr>
                        <tr>
                            <td>表内容单元格</td>
                            <td>表内容单元格</td>
                            <td>
                                <a href="#">操作</a>
                            </td>
                        </tr>
                        <tr>
                            <td>表内容单元格</td>
                            <td>表内容单元格</td>
                            <td>
                                <a href="#">操作</a>
                            </td>
                        </tr>
                        <tr class="trSum">
                            <td>总计</td>
                            <td colspan="2">1000</td>
                        </tr>
                    </table>
            </div>
        </div><div class="rightDiv">
            <h2><span>|</span>这是侧栏的标题</h2>
            <h4>侧栏注册窗口标题</h4>
            <form>
                请输入邮箱地址:
                <input type="email" name="mailAddress" placeholder="这是一个文本输入框">
                <br>
                <br>邮箱地址请按要求格式输入
                <br>
                <br>请输入密码:
                <input type="password" name="mailPwd" placeholder="这是一个文本输入框"> 
                <br>请重复输入密码:
                <input type="password" name="mailPwd" placeholder="这是一个文本输入框">
                <br>
                <br>密码请为6-16位英文数字
                <br>性别:
                <input type="radio" name="sex" checked>Male
                <input type="radio" name="sex">Female
                <br>
                <label>城市: </label>
                <select name="citys">
                    <option>shenzhen</option>
                    <option>beijing</option>
                    <option>shanghai</option>
                </select>
                <br>
                <label>爱好: </label>
                <input type="checkbox" name="love" value="运动">运动
                <input type="checkbox" name="love" value="艺术">艺术
                <input type="checkbox" name="love" value="科学">科学
                <br>
                <label>个人描述: </label>
                <textarea name="myDes" rows="2" cols="30" placeholder="这是多行输入框，输入你的描述"></textarea>
                <br>
                <input type="submit" class="submitBt" value="确认提交">
            </form>
        </div>
        <div class="footer">
            <p>Copyright ©2014-2018 YueDong. All Rights Reserved. </p>
        </div>
    </div>
</body>
</html>